<!DOCTYPE html>
<html lang="en">
<head>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数据分享统计_{$webname}</title>
<link rel="stylesheet" type="text/css" href="<?=$NOW_THEME_URL?>/Assets/css/reset.css">
<link rel="stylesheet" type="text/css" href="<?=$NOW_THEME_URL?>/Assets/css/common.css">
<link rel="stylesheet" type="text/css" href="<?=$NOW_THEME_URL?>/Assets/css/page_sell.css">
<link rel="stylesheet" type="text/css" href="<?=$NOW_THEME_URL?>/Assets/plugins/FontAwesome/css/font-awesome.min.css">
<script src="__PUBLIC__/Js/jquery.min.js"></script>
<script src="__PUBLIC__/Js/jquery-migrate-1.2.1.min.js"></script>
<script src="__PUBLIC__/Plugins/Highcharts/js/highcharts.js"></script>
<script src="__PUBLIC__/Plugins/Datepicker/WdatePicker.js"></script>
<script src="__PUBLIC__/Plugins/Highcharts/js/exporting.js"></script>
<script type="text/javascript">

var urls = '{:U("Total/share_chart")}';
$(function(){
	
	$('#goBack').on('click',function(){
		window.history.back();
	});
	
	/*右侧导航点击事件*/
	$('.hb_right').click(function(){
		$(".wrapper").toggleClass("a");
		$(".nav_box").toggleClass("b");
	});
	
	/*右侧导航二级*/
	$('.erji').click(function(){
			$(this).find("ul").toggleClass("c");
	});
	
	$(".tabBox .tabCont:first").css("display","block");
	$(".tabBox .tabNav li").on('click',function(){
		$(this).siblings("li").removeClass("now");
		$(this).addClass("now");
		$(this).parents(".tabBox").find(".tabCont").css("display","none");
		var i=$(this).index();
		$(this).parents(".tabBox").find(".tabCont:eq("+i+")").css("display","block");
	});
	
	/* createChart(urls); */
	
	$('.day_search').each(function(){
		$(this).bind("click",function(){
			var num  = $(this).attr("num");
			var type = $(this).attr("type");
			var url = urls+"&num="+num+"&type="+type;
			createChart(url);
		});
	});
	
	$('.date_search').bind("click",function(){
		var start = $.trim($('#start_time').val());
		var end   = $.trim($('#end_time').val());
		var type  = $.trim($('#type_search').val());
		if(start && end){
			var url = urls+"&func=timepart&type="+type+"&start="+start+"&end="+end;
			createChart(url);
		}else{
			alert("请选择开始时间或者结束时间");
		}
	});
	
	$('#type_search').bind("change",function(){
		var start = $('#type_search').find("option:selected").attr("start");
		var end   = $('#type_search').find("option:selected").attr("end");
		$('.start_time').val("");
		$('#start_time').attr("onfocus",start);
		$('#end_time').attr("onfocus",end);
	});

});

//生成表格
function createChart(url){
	var result = $.get(url,
		function(data){
			$('#container').highcharts(data);
	},'json');
}
</script>

</head>
<body>
<!-- 头部开始-->
<include file="Public:header" />
<!-- 头部结束-->
<!--主体开始-->
<div id="pageHome">
	<!--主体盒子开始-->
    <div id="wrapper" class="wrapper radius_5 bg_white">
    	<!--面包屑导航开始-->
        <ul class="pagePosition clearfix">
        	<li><a href="{:U('Index/index')}"><i class="icon-home"></i> 首页</a></li>
        	 <li><i class="icon-angle-right"></i></li>
            <li><a href="#">数据分享统计</a></li>
           
        </ul>
        <!--面包屑导航结束-->
        <div class="space_hx">&nbsp;</div>
        <!--销售情况盒子开始-->
        <div class="tabBox_t">
        	<div class="tabBox">
            	<!--导航盒子开始-->
                <ul class="tabNav">
                    <li class="now">关键指标</li>
                    <li>列表</li>
                </ul>
                <!--导航盒子结束-->
                <!--关键指标盒子开始-->
                <div class="tabCont clearfix" style="display:block;">
					<dl class="clearfix">
						<dt>今日</dt>
						<dd>
							<span><strong>页面浏览次数:</strong>{$detail['table'][$today]['pageid']}<i>人</i></span>
							<span><strong>独立访客次数:</strong>{$detail['table'][$today]['cookieid']}<i>人</i></span>
							<span><strong>访问次数:</strong>{$detail['table'][$today]['sessionid']}<i>次</i></span>
							<span><strong>独立IP次数:</strong>{$detail['table'][$today]['ip']}<i>次</i></span>
						</dd>
					</dl>
					<dl class="clearfix">
						<dt>昨日</dt>
						<dd>
							<span><strong>页面浏览次数:</strong>{$detail['table'][$yesday]['pageid']}<i>人</i></span>
							<span><strong>独立访客次数:</strong>{$detail['table'][$yesday]['cookieid']}<i>人</i></span>
							<span><strong>访问次数:</strong>{$detail['table'][$yesday]['sessionid']}<i>次</i></span>
							<span><strong>独立IP次数:</strong>{$detail['table'][$yesday]['ip']}<i>次</i></span>
						</dd>
					</dl>
					<dl class="clearfix">
						<dt>总共</dt>
						<dd>
							<span><strong>页面浏览次数:</strong>{$detail['total']['pageid']}<i>人</i></span>
							<span><strong>独立访客次数:</strong>{$detail['total']['cookieid']}<i>人</i></span>
							<span><strong>访问次数:</strong>{$detail['total']['sessionid']}<i>次</i></span>
							<span><strong>独立IP次数:</strong>{$detail['total']['ip']}<i>次</i></span>
							<span><strong>注册人数:</strong>{$detail['total']['reg']}<i>人</i></span>
						</dd>
					</dl>
                </div>
                <!--关键指标盒子结束-->
               
                <!--表格盒子开始-->
                <div class="tabCont liebiao">
                    <table width="100%" cellpadding="0" cellspacing="0" class="clearfix">
                    	<thead>
                        	<tr>
                            	<th>日期</th>
                                <th>浏览页面次数</th>
                                <th>浏览次数</th>
                                <th>独立访客次数</th>
                                <th>独立IP次数</th>
                            </tr>
                        </thead>
                        <tbody>
                        <volist name="detail.table" id="v">
                          <tr>
                           	<td>{$key}</td>
                            <td>{$v['pageid']}</td>
                            <td>{$v['cookieid']}</td>
                            <td>{$v['sessionid']}</td>
                            <td>{$v['ip']}</td>
                          </tr>
                        </volist>
                        </tbody>
                    </table>

                </div>
                <!--表格盒子结束-->
            </div>
        </div>
        <!--销售情况盒子结束-->
    </div>
    <!--主体盒子结束 -->
    <!--导航盒子开始-->
    <include file="Public:menu" />
    <!--导航盒子结束-->
</div>
<!--主体结束-->
</body>
</html>